<template>
  <div class="page-information-detail">
    <white-header :isShowTopNav="true" :isShowBack="true" :isShowRight="true" title="新闻资讯"></white-header>
    <div class="information-header">
      <div class="title">{{news.title}}</div>
      <div class="author">
        <span>{{formatDate(news.publishTime)}}</span>
        <span style="margin-left:.2rem;">{{news.author}}</span>
      </div>
    </div>
    <div class="information-content ql-snow">
      <div class="ql-editor" v-html="news.introduce"></div>
    </div>
  </div>
</template>
<script>
import { mapState, mapActions, mapMutations } from "vuex";
import WhiteHeader from "~/components/mobile/WhiteHeader.vue";
import { getNews } from "~/api/news";
export default {
  components: {
    WhiteHeader
  },
  data() {
    return {
      news: {},
    };
  },
  created() {
    this.getNews();
  },
  mounted() {},
  activated() {
      this.getNews();
  },
  methods: {
    ...mapMutations(["SET_IS_LOADING"]),
    formatDate(timestamp) {
      let date = new Date(timestamp);
      let year = date.getFullYear();
      let month = date.getMonth() + 1;
      let day = date.getDate();
      let hour = date.getHours();
      let minute = date.getMinutes();
      let second = date.getSeconds();
      let add0 = (m) => {
        return m < 10 ? "0" + m : m;
      };
      let showTime = null;
      if (new Date(timestamp).toDateString() === new Date().toDateString()) {
        if (hour < 10) {
          showTime = "上午";
        } else if (hour < 12) {
          showTime = "中午";
        } else if (hour < 18) {
          showTime = "下午";
        } else {
          showTime = "晚上";
        }
        // console.log("今天", showTime + " " + add0(hour) + ":" + add0(minute));
        return showTime + " " + add0(hour) + ":" + add0(minute);
      } else {
        // console.log("以前", add0(year) + "/" + add0(month) + "/" + add0(day));
        return add0(year) + "/" + add0(month) + "/" + add0(day);
      }
    },
    //获取资讯
    async getNews() {
      this.SET_IS_LOADING(true);
      let id = this.$route.query.id;
      let result = await getNews(id);
      if (result && result.data && result.data.code == 200) {
        this.news = result.data.data;
      } else {
        this.$Message.error(this.$t("locale.pc.index.t9"));
      }
      this.SET_IS_LOADING(false);
    },
  },
};
</script>
<style lang="scss">
.page-information-detail {
  @import "~/assets/css/richtext.scss";
}
</style>
<style lang='scss' scoped>
.page-information-detail {
  min-height: calc(100vh - 1.6rem);
  font-size: .3rem;
  padding: .3rem;
  .information-header{
    //   padding: .3rem;
      .title{
            font-size: .3rem;
            font-weight: bold;
            font-stretch: normal;
            
            letter-spacing: 0px;
            color: #313233;
      }
      .author{
          margin-top: .2rem;
          color: #babec2;
      }
  }
  .information-content{
      margin-top: .2rem;
  }
}
</style>